<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path;
%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
<title>学籍管理-云校通</title>
<jsp:include page="/WEB-INF/page/common/_header.jsp"></jsp:include>
</head>
<body ontouchstart>
    <div class="searchbar_wrap"></div>
    <div id="search-content" style="height: 100%;z-index: 10;position:relation;display: none;">
       <div class="sb-content" style="overflow:scroll;">
      		
       </div>
    </div>
	<div class="weui_panel weui_panel_access" style="margin-top: 0;">
       <div class="weui_panel_bd" id="studentList">
       </div>
    </div>
	<jsp:include page="/WEB-INF/page/common/_footer.jsp"></jsp:include>
	<script>
		$(function(){
	 		$('.searchbar_wrap').searchBar({
				cancelText: "取消",
				searchText: '请输入学生姓名',
				onfocus: function(value) {
					$("#search-content").show();
					$(".weui_panel").hide();
				},
				onblur: function(value) {
				},
				input: function(value) {
					queryItem(value);
				},
				onsubmit: function(value) {
					queryItem(value);
				},
				oncancel: function() {
					$("#search-content").hide();
					$(".weui_panel").show();
					$(".sb-content").html('');
				},
				onclear: function() {
					$(".sb-content").html('');
					$(".weui_panel").show();
				}
			});
	 		var page = 0;
			var size = 20;
		    $('.weui_panel').dropload({
		        scrollArea : window,
		        autoLoad : true,//自动加载
		        domDown : {//上拉
		            domClass   : 'dropload-down',
		            domRefresh : '<div class="dropload-refresh f15 "><i class="icon icon-20"></i>上拉加载更多</div>',
		            domLoad    : '<div class="dropload-load f15"><span class="weui-loading"></span>正在加载中...</div>',
		            domNoData  : '<div class="dropload-noData">没有更多数据了</div>'
		        },
		        domUp : {//下拉
		            domClass   : 'dropload-up',
		            domRefresh : '<div class="dropload-refresh"><i class="icon icon-114"></i>上拉加载更多</div>',
		            domUpdate  : '<div class="dropload-load f15"><i class="icon icon-20"></i>松手开始加载...</div>',
		            domLoad    : '<div class="dropload-load f15"><span class="weui-loading"></span>正在加载中...</div>'
		        },
		        loadDownFn : function(me){//加载更多
		        	page++;
		        	var params = {
	        			page: page,
		    			rows: size,
		    			grade: "${model.grade}",
		    			clazz: "${model.clazz}"
	    			};
	    			$.ajax({
	    	          	url : basePath + "/ls/students/manage/page/query",
	    	  	 		type : "post",
	    	  	 		dataType : "json",
	    	  	 		data : params,
	    	            success: function(data){
	             		  if(data.rows.length == 0 || page*size >= data.total) {// 如果没有数据
	             			// 锁定
		                      me.lock();
		                      // 无数据
		                      me.noData();
	                      }
	             		  setTimeout(function(){
	             			 loadItemHtml(data);
		                      // 每次数据加载完，必须重置
	             			 me.resetload();
	             		  },200);
	                  },
	                  error: function(xhr, type){
	                  }
	              });      
		        }
		    });
		});
		function loadItemHtml(data) {
			var html = "";
			for(var i in data.rows) {
				var itm = data.rows[i];
				html += '<div class="weui_cell">';
				html += '<div class="weui_cell_hd"><img class="circle bg-blue-b" src="<%=basePath%>/images/default.jpg" style="width:50px;margin-right:20px;display:block"></div>';
				html += '<div class="weui_cell_bd weui_cell_primary"><p>' + itm.name + '<a href="<%=basePath %>/ls/students/manage/info/query/' + itm.id + '"><i class="icon icon-67 f20 f-blue"></i></a></p>';
				if(itm.parentCount == null) {
					html += '<p style="color: #888888; font-size: 13px;">未绑定微信</p>';
				}
				html += '</div><div class="weui_cell_ft">';
				
				html += '<span class="ml10"><a href="<%=basePath %>/ls/student/groupup/' + itm.id + '"class="weui_btn weui_btn_mini bg-blue-b">成长记录</a></span>';
	            if("${model.clazz}" != "" && itm.parentCount != null) {
	            	html += '<span class="ml10"><a href="<%=basePath%>/ls/groupChat/class/sx?grade=${model.grade}&clazz=${model.clazz}&sid='+ itm.id +'" class="weui_btn weui_btn_mini bg-blue-b">私信</a></span>';
	            }
	            html += '</div></div>';
			}
			$("#studentList").append(html);
		}
		var search = false;
		function queryItem(keyword) {
			if(!/^[\u4E00-\u9FA5]+$/.test(keyword)) return;
			if(search) return;
			search = true;
			$.ajax({
	    		url: basePath + "/ls/students/manage/keyword",
	    		type: 'POST',
	    		dataType : "json",
	    		data: {
	    			grade: "${model.grade}",
	    			clazz: "${model.clazz}",
	    			studentName: keyword
	    		},
	    		success: function(data) {
	    			search = false;
	    			if (data != null && data.length > 0) {
	    				var html = "";
	    				for(var i in data) {
	    					var itm = data[i];
	            			html += '<div class="weui_cell">';
	    					html += '<div class="weui_cell_bd weui_cell_primary"><p>' + itm.name + '</p>';
	    					if(itm.parentCount == null) {
	    						html += '<p style="color: #888888; font-size: 13px;">未绑定微信</p>';
	    					}
	    					html += '</div><div class="weui_cell_ft">';
		    	            if("${model.clazz}" != "" && itm.parentCount != null) {
		    	            	html += '<span><a href="<%=basePath%>/ls/groupChat/class/sx?grade=${model.grade}&clazz=${model.clazz}&sid='+ itm.id +'" class="weui_btn weui_btn_mini bg-blue-b">私信</a></span>';
		    	            }
		    	            html += '<span class="ml10"><a href="<%=basePath %>/ls/students/manage/info/query/' + itm.id + '"class="weui_btn weui_btn_mini bg-blue-b">修改</a></span>';
		    	            html += '</div></div>';
	    				}
	    				$(".sb-content").html(html);
	    			}
	    		},
	    		error: function(data) {
	    			alert("系统异常,请联系管理员");
	    		}
	    	});
		}
	</script>
</body>
</html>